<template>
  <div class="container-box">
    <div class="slider_type2  wow fadeInDown">
      <img class="primary_img" src="../../static/images/productimg/chanpingbg.png" alt="" />
    </div>
    <div class="section-box">

      <div class="section donate_now">
        <div class="container">
          <div class="power_heading_wrapper text-center">
            <h1 class="power_title ">加入我们</h1>
          </div>
          <div class="donation_form">
            <form action="registration" method="POST">
              <div class="row">
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="name">姓名</label>
                    <input type="text" class="form-control" id="name" name="name" placeholder="如：张三">
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="phone">电话</label>
                    <input type="text" class="form-control" id="phone" name="phone" placeholder="15866667777">
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="email">邮箱</label>
                    <input type="email" class="form-control" id="email" name="email" placeholder="cddnykj@qq.com">
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="address">地址</label>
                    <input type="text" class="form-control" id="address" name="address" placeholder="所在地址">
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="sex">性别</label>
                    <select class="select_dropdown_value" id="sex">
                      <option value="1">男性</option>
                      <option value="2">女性</option>
                    </select>
                  </div>
                </div>
                <div class="col-lg-6">
                  <div class="form-group">
                    <label for="occupation">职业</label>
                    <input type="text" class="form-control" id="occupation" name="occupation" placeholder="如：职员">
                  </div>
                </div>
                <div class="col-lg-12">
                  <div class="power_button_group">
                    <input class="power_button effect_1" type="button" value="提交资料">
                  </div>
                </div>
              </div>
            </form>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>
 
<script>
export default {
  data() {
    return {};
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.donate_now {
  margin-top: -8%;
  background-color: #fff;
  width: 90%;
  margin-left: 5%;
  border-radius: 10px;
}
.container-box {
  background-color: #f8f6ff;
}
.section-box {
  border-bottom: 40px solid #f8f6ff;
}
.power_heading_wrapper {
  padding-top: 20px;
  margin: 0;
}
.power_button_group {
  justify-content: center;
}
.section {
  padding-bottom: 30px;
}
@media screen and (max-width: 768px) {
}
@media only screen and (max-width: 480px) {
  .section-box {
    border-bottom: 10px solid #f8f6ff;
  }
  .donate_now {
    margin-top: -8%;
    background-color: #fff;
    width: 96%;
    margin-left: 2%;
    border-radius: 8px;
  }
}
</style>
